<!DOCTYPE html>
<html lang="en">

<head>
    <!-- <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.0/css/bootstrap-grid.css" rel="stylesheet"> -->
    <link href="../vendor/bootstrap-grid.css" rel="stylesheet">
    <meta charset="utf-8" />
    <link rel="apple-touch-icon" sizes="76x76" href="../assets/img/favicon.ico">
    <link rel="icon" type="image/png" href="../assets/img/favicon.ico">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no'
        name='viewport' />



    <!-- Font Awesome Icons -->
    <!-- <link rel="stylesheet" href="#" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous"> -->
    <link rel="stylesheet" href="#" crossorigin="anonymous">

    <!-- Main CSS -->
    <link href="../assets/css/main.css" rel="stylesheet" />
	<link href="../assets/layui/css/layui.css" rel="stylesheet">
	<link href="../assets/layui/cascader/cascader.css" rel="stylesheet">
    <!-- Animation CSS -->
    <link href="../vendor/aos.css" rel="stylesheet" />
    <style>
        .col,
        .selControlItem,
        .selControl {
            /* display: flex;
            justify-content: space-between; */
        }

        .form-control {
            /* width: 82%; */
        }

        label {
            width: 17%;
            line-height: 38.8px;
        }

        #probation {
            padding: 0 30px;
        }

        .productDefin {
            width: 17%;
        }

        .selControl {
            width: 100%;
        }



        .definition {
            display: none;
        }

        .selShow {
            display: block !important;
        }
        .selRadio{
            width: 82%;
            line-height: 38.8px;
        }
        .selRadio span{
            padding-right: 30px;
        }
        input[type='radio']{
            margin-right: 10px;
        }
		.layui-form-label{
			width: 120px;
		}
		.selControlItem {
		    width: 82%;
		    padding-bottom: 15px;
		}

		.selControlItem span {
		    line-height: 38.8px;
		}

		.table tr:last-child {
		    border: none;
		}

		.table tr th {
		    background-color: #4476A7;
		    color: #fff;
		    font-weight: 400;
		    text-align: center;
		    position: relative;
		}

		.table tr th::after {
		    content: '';
		    width: 1px;
		    height: 12px;
		    position: absolute;
		    right: 0;
		    background-color: #fff;
		    top: 50%;
		    transform: translateY(-50%);
		}

		.table tr th:last-child::after {
		    content: '';
		    width: 0;
		    height: 0;
		    background-color: transparent;
		}

		.table tr td {
		    text-align: center;
		    border: 1px solid green;
		    border-top: 1px solid green;
		    vertical-align: baseline;
		    position: relative;
		}

		.table tr td select {
		    width: 80%;
		    outline: none;
		    border: none;
		    appearance: none;
		    -webkit-appearance: none;
		    -moz-appearance: none;
		}

		table tr td input {
		    outline: none;
		    border: none;
		    text-align: center;
		    width: 100%;
		}

		table tr td:last-child {
		    border: none;
		}
		/* 火狐样式 */
		@media screen and (min--moz-device-pixel-ratio:0) {
			#controlSet tr td>input,#priceSet tr td>input {
				margin-top: -30px;
				display: block;
			}
		}
		.layui-input-block .ruleChoose{
			position: absolute;
			top: 10px;
		}
		.layui-input-block .ruleChooseBtn{
			text-decoration:underline !important;
			cursor: pointer;
		}
		.layui-input-block .ruleChooseSelect{

		}
		.layui-input-block .ruleChooseTip{

		}
		.show{
			display: block;
		}
		.hide{
			display: none;
		}

    </style>
</head>

<body>


    <!-------------------------------------- PRICING --------------------------------------->
    <section class="pt-4 pb-5">
        <div class="col-md-12" id="probation">
            <form id="form1" class="layui-form" lay-filter="productRegisterForm" >
				<div class="layui-form-item">
				    <label class="layui-form-label">数据类别：</label>
				    <div class="layui-input-block sourceType">
				      <input type="radio" name="sourceType" value="4" lay-filter="sourceType" title="离线数据" checked>
				      <input type="radio" name="sourceType" value="1" lay-filter="sourceType" title="在线数据" disabled>
				    </div>
				</div>
				<!-- <div class="row form-group">
					<div class="col">
						<label class="layui-form-label"><span style="color: red;">*</span>生成方式：</label>
						<div class="layui-input-block" style="margin-left: 120px;">
							<select class="form-control" name="generationMode"  lay-filter="generationMode">
								<option value=0>自定义生成</option>
								<option value=3>定制生成</option>
							</select>
						</div>
					</div>
					<div class="col disabledNone" id="customRequestDiv">
						<label class="layui-form-label">定制请求：</label>
						<div class="layui-input-block" style="margin-left: 120px;">
						<input type="text" name="customRequestId" id="customRequestId">
					</div>
				</div>
				</div> -->
				
				<div class="row form-group">
					<div class="col">
						<label class="layui-form-label"><span style="color: red;">*</span>数据名称：</label>
						<div class="layui-input-block" style="margin-left: 120px;">
							<input type="text" class="form-control" required="" name="productName">
						</div>
					</div>
					<div class="col datasource">
						<div class="online hide">
							<label class="layui-form-label"><span style="color: red;">*</span>数据资源：</label>
							<div class="layui-input-block" style="margin-left: 120px;">
								<!--								<input name="contentId" lay-filter="contentId" id="dataSource" >-->
								<div id="dataSource"></div>
								<!--								<input name="sourceId" lay-filter="sourceId" id="dataChannel" >-->
							</div>
						</div>
						<div class="offline" >
							<label class="layui-form-label"><span style="color: red;">*</span>数据文件</label>
							<div class="layui-input-block" style="margin-left: 120px;">
								<input type="file" accept="*/*" id="sourceFile" class="form-control" style="font-size: 12px;">
								<a href="#" id="offlineLink" style="font-size: 12px;margin: 5px 20px; display: none;" target="_blank">点击查看文件</a>
							</div>
						</div>

					</div>
				</div>
				<div class="row form-group">
					<div class="col">
						<label class="layui-form-label"><span style="color: red;">*</span>关键词：</label>
						<div class="layui-input-block" style="margin-left: 120px;">
							<input type="text" id="keywordCas" style="display: block;width: 100%;height: calc(2.3rem + 2px);padding: 0.35rem 1.2rem;font-size: 1rem;line-height: 1.6;border: 1px solid #ced4da;" />
						</div>
					</div>
					<div class="col">
						<label class="layui-form-label"><span style="color: red;">*</span>分类：</label>
						<div class="layui-input-block" style="margin-left: 120px;">
							<input type="text" class="form-control" required="" name="typeIdList" id="typeIdListCas">
						</div>
					</div>
				</div>



				<div class="row form-group">
					<div class="col">
						<label class="layui-form-label"><span style="color: red;">*</span>数据简介：</label>
						<div class="layui-input-block" style="margin-left: 120px;">
							<input type="text" class="form-control" required="" name="brief" maxlength="100">
						</div>
					</div>
					<div class="col">
						<label class="layui-form-label"><span style="color: red;">*</span>数据类型：</label>
						<div class="layui-input-block" style="margin-left: 120px;">
							<input type="text" class="form-control" required="" name="productType" >
						</div>
					</div>
				</div>

                <div class="row form-group">
<!--                	<div class="col">-->
<!--                		<label class="layui-form-label">编程说明：</label>-->
<!--                		<div class="layui-input-block" style="margin-left: 120px;">-->
<!--                			<textarea class="form-control" name="programming" placeholder="请填写编程说明,字数在150个字以内"  maxlength="150"></textarea>-->
<!--                		</div>-->
<!--                	</div>-->
					<div class="col">
						<label class="layui-form-label"><span style="color: red;">*</span>详细说明：</label>
						<div class="layui-input-block" style="margin-left: 120px;">
							<textarea class="form-control" required="" name="detail" placeholder="请输入详细说明,字数在200个字以内"  maxlength="200"></textarea>
						</div>
					</div>
                	<div class="col">
						<label class="layui-form-label">数据定义：</label>
						<div class="layui-input-block" style="margin-left: 120px;">
							<textarea class="form-control" name="definition" placeholder="请填写数据定义,字数在150个字以内"  maxlength="1500"></textarea>
						</div>
                	</div>

                </div>

                <div class="definition selShow">
					
					
					<div class="row form-group">
						<!-- <div class="col">
							<label class="layui-form-label">参数设置：</label>
							<div class="layui-input-block" style="margin-left: 120px;">
								<input type="file" accept="image/*" id="paramsFile" class="form-control" style="font-size: 12px;">
							</div>
						</div> -->
						<div class="col">
							<label class="layui-form-label">展示图标：</label>
							<div class="layui-input-block" style="margin-left: 120px;">
								<input type="file" accept="image/*" id="customFile" class="form-control" style="font-size: 12px;">
								<span style="display: block;font-size: 12px;padding-top:10px;">(建议像素采用像素宽高600x300，或等比例像素)</span>
							</div>
						</div>
					</div>
					<div class="layui-form-item">
						<div class="col">
							<img src="" id="productIconUrl" style="max-width: 300px;max-height: 150px;margin-left: 105px;"/>
						</div>
					</div>
<!--					<label class="layui-form-label" style="height: 120px;">控制管理：</label>-->
					
					
					</div>


                <div class="definition setProductBox">
					<label class="layui-form-label">数据设置：</label>
					<!-- <div class="selControlItem" style="padding-right: 10%;">
						<span class="addPriceItem text-success"style="font-size: 25px;font-weight: 600;cursor: pointer;">+</span>
						<span class="pl-2 text-danger" style="font-size: 38px;font-weight: 600;cursor: pointer;color: #fff !important;">-</span>
						<span style="width:120px;">产品1</span>
						<span>产品选择：</span>
						<select class="form-control selectProducts PRODUCT_Set_productSonId" style="width:50%;">
							<option value="">请选择1</option>
						</select>
						<input type="number" placeholder="价格占比" class="PRODUCT_Set_packagePriceRatio" style="width: 100px;height: 38px;border:1px solid #EEEEEE;padding-left: 10px;"/>

					</div> -->
					<div class="col-md-12" style="margin: 10px auto;">
						<div class="control mb-5">
							<table class="table" id="productSet">
								<thead>
									<tr>
										<th style="width: 60px;">序号</th>
										<th>数据选择</th>
										<th>价格占比</th>
										<th style="width: 200px;">
<!--											<span class="add addTrItem">-->
<!--												<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus-lg" viewBox="0 0 16 16">-->
<!--													<path fill-rule="evenodd" d="M8 2a.5.5 0 0 1 .5.5v5h5a.5.5 0 0 1 0 1h-5v5a.5.5 0 0 1-1 0v-5h-5a.5.5 0 0 1 0-1h5v-5A.5.5 0 0 1 8 2Z"/>-->
<!--												  </svg>-->
<!--											</span>-->
											<button class="layui-btn addProductItem layui-btn-xs" type="button">新增</button>
											<button class="layui-btn deletedProductItem layui-btn-xs" type="button">删除</button>
										</th>
									</tr>
								</thead>
								<tbody>

								</tbody>

							</table>

						</div>
					</div>
                </div>
				<!-- <button type="submit" class="btn btn-cyan btn-round text-white" style="float: right;" id="submitPutOn">提交并上架</button> -->
                <button type="button" class="btn btn-cyan btn-round text-white mr-2 mr-2" style="float: right;" id="submitForm">提交</button>
				<!-- <button type="button" class="btn btn-cyan btn-round text-white mr-2" style="float: right;" id="saveForm">保存</button> -->
            </form>
        </div>
    </section>



    <!-------------------------------------- JAVASCRIPT --------------------------------------->
<!--	工具栏模板：-->
	<script type="text/html" id="toolbarDemo">
		<div class="layui-btn-container">
			<button class="layui-btn layui-btn-sm" lay-event="add">添加</button>
			<button class="layui-btn layui-btn-sm" lay-event="delete">删除</button>
		</div>
	</script>
	<script src="../vendor/jquery.min.js" type="text/javascript"></script>
    <script src="../vendor/popper.min.js" type="text/javascript"></script>
    <script src="../vendor/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="../vendor/share.js" type="text/javascript"></script>
    <script src="../js/functions.js" type="text/javascript"></script>
    <!-- <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.0/js/bootstrap.bundle.js"></script> -->
    <script src="../vendor/bootstrap.bundle.js"></script>
    <script src="../assets/layui/layui.js" type="text/javascript"></script>
	<script src="../assets/layui/cascader/cascader.js" type="text/javascript"></script>
    <script src="../js/tool.js" type="text/javascript"></script>

    <!-- Animation -->
    <script src="../vendor/aos.js" type="text/javascript"></script>
<!--	<script src="../assets/layui/layui_exts/selectInput.js"></script>-->
	<script src="../js/dataProductRegistr/productRegisterPop.js" type="text/javascript"></script>

</body>

</html>
